﻿@model AvaliacaoOnline.Data.Questao

@{
    ViewBag.Title = "Questao";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
@section head{
<script src="@Url.Content("~/scripts/jquery.countdown.min.js")" type="text/javascript"></script>
}
<script type="text/javascript">
    var disableSelecao = false;
    var intervaloValidacao = 30 * 1000;
    var tempoEsgotado = 0;
    $(function () {
        setTimeout(function () {
            setTimeout(function(){validarConclusao();}, 5 * 1000);
            $(".spanAlternativa").each(function(i, item){
                if ($(item).attr('numero') == @(ViewData["NumeroResposta"])){
                    $(item).click();
                }
            });

            @if (((bool)ViewData["LimiteTempo"]) && (ViewData["NumeroResposta"].ToString() != "-1"))
            {
            <text>
                disableSelecao = true;
            </text>
            }

            @if ((bool)ViewData["LimiteTempo"])
            {
            <text>
            $('#countdown').countdown({
                until: '+@ViewData["TempoRestante"]', 
                compact: true, 
                layout: '{hnn}{sep}{mnn}{sep}{snn}',
                onExpiry: function(){
                    concluirAutomatico();
                }
            });
            </text>
            }

            $('#countdown').countdown({
                until: '+@ViewData["TempoRestanteNovartis"]', 
                compact: true, 
                layout: '{hnn}{sep}{mnn}{sep}{snn}',
                onExpiry: function(){
                    concluirAutomatico();
                }
            });
        }, 0);
    });

    trMouseOver = function(tr){
        $(tr).css("background-color", "#ededed");
    }
    
    trMouseOut = function(tr){
        $(tr).css("background-color", "#fff");
    }

    seleciona = function(numero){
        if (disableSelecao)
            return;

        $(".spanAlternativa").removeClass('alternativa-radio-selected');
        $(".spanAlternativa").removeClass('alternativa-radio-unselected');
        $("#formNext").find("input[name='numeroAlternativa']").val(numero);

        $(".spanAlternativa").each(function(i, item){
            if ($(item).attr('numero')==numero){
                $(item).addClass('alternativa-radio-selected');
            }else{
                $(item).addClass('alternativa-radio-unselected');
            }
        });
    }

    responde = function (obj) {
        
        if ($("#formNext").find("input[name='numeroAlternativa']").val() == '' || $("#formNext").find("input[name='numeroAlternativa']").val() == 0) {
            $.showMessage("Selecione uma alternativa antes de prosseguir.");
            return;
        }

        $("#formNext").submit();
    }

    respondePrevious = function (obj) {
        if ($("#formNext").find("input[name='numeroAlternativa']").val() == '') {
            $("#formNext").find("input[name='numeroAlternativa']").val(0);
            return;
        }
        $("#formPrev").find("input[name='numeroAlternativa']").val($("#formNext").find("input[name='numeroAlternativa']").val());
        $("#formPrev").submit();
    }

    paginar = function(pagina){
        if ($("#formNext").find("input[name='numeroAlternativa']").val() == '') {
            $("#formNext").find("input[name='numeroAlternativa']").val(0);
            return;
        }
        $("#formPrev").find("input[name='numeroAlternativa']").val($("#formNext").find("input[name='numeroAlternativa']").val());
        $("#formPrev").find("input[name='step']").val(pagina);
        $("#formPrev").submit();
    }

    concluirAutomatico = function(){
        $("input[name='concluir']").val(2);
        $("input[name='Proximo']").hide();
        $("input[name='Anterior']").hide();
        $("#formNext").submit();
    }

    validarConclusao = function(){
        setTimeout(function(){validarConclusao();}, intervaloValidacao);
        $.ajax({
            url: '@Url.Content("~/Teste/ValidarConclusao")',
            dataType: 'json',
            type: 'post',
            data: { idAvaliacao: @Model.IdAvaliacao },
            success: function (data) {
                if (data != '')
                    concluirAutomatico();
            }
        });
    }
</script>
<div class="span-6">
    @if (@ViewData["LogotipoCliente"] != "")
    {
    <img src="@ViewData["LogotipoCliente"]" />
    }
</div>
<div class="span-12 avaliacao-titulo">
    @Model.Avaliacao.Titulo
</div>
<div class="span-6 last usuario-nome" style="text-align:right;">
    @Session["NomeCliente"]
    <br />
    <a href="@Url.Action("Index", "Sair")">Sair</a>
</div>
<div class="clear"></div>
<div class="span-24 last questao-timer">
@if ((bool)ViewData["LimiteTempo"])
{    
    <text>Tempo restante: <span id="countdown"></span></text>
}
<span id="countdown"></span>
</div>
<div class="clear"></div>
<div class="span-24">
    <div class="span-23 ui-widget ui-corner-all questao-container" >
        <div>
            @if (!String.IsNullOrEmpty(Model.ArquivoMidia1))
            {
            <div class="span-22 questao-imagem-@Model.Id-1">@Html.Raw(ViewData["ArquivoMidia1"] as string)</div>
            <div class=clear></div>
            }
            <div class="questao-titulo">
                <span id="spanDescricao">@Html.Raw(Model.Descricao)</span>
            </div>
            <div class="clear"></div>
            <br />
            <br />
            @if (!String.IsNullOrEmpty(Model.ArquivoMidia2))
            {
            <text><div class="span-12"></text>
            }
            else
            {
            <text><div class="span-22"></text>
            }
            <table style="width:100%;" >
            @foreach (AvaliacaoOnline.Data.AlternativaQuestao alternativa in ((List<AvaliacaoOnline.Data.AlternativaQuestao>)ViewData["Alternativas"]))
            {
                <tr onmouseover="trMouseOver(this);" onmouseout="trMouseOut(this);" style="background-color:#fff;">
                    <td style="padding-top:15px;background-color:transparent;width:30px;text-align:center;" onclick="seleciona('@alternativa.NumeroAlternativa');"><span numero="@alternativa.NumeroAlternativa" class="spanAlternativa alternativa-radio-unselected">&nbsp;&nbsp;&nbsp;&nbsp;</span></td>
                    <td style="padding-top:15px;background-color:transparent;" class="alternativa-label" onclick="seleciona('@alternativa.NumeroAlternativa');">@Html.Raw(alternativa.Descricao)</td>
                </tr>
                <tr><td colspan="2" style="font-size:.4em;background-color:transparent;">&nbsp;</td></tr>
            }
            </table>
                <div class="clear"></div>
            </div>
            @if (!String.IsNullOrEmpty(Model.ArquivoMidia2))
            {
            <text><div class="span-10 questao-imagem-@Model.Id-2">@Html.Raw(ViewData["ArquivoMidia2"] as string)</div></text>
            }
        </div>
    </div>
</div>
<div class=clear></div>
<div class="span-6" style="" >
    <span class="questao-info">@ViewData["Paginas"]</span>
</div>
<div class="span-18 last "  >
    <span class="questao-barra-botoes">
        
        <form action="@(Url.Content("~/" + ViewData["ClienteUrl"].ToString() + "/Teste/Resposta"))" id="formNext" method="post" style="display:inline;">
            <input type="hidden" name="IdAvaliacao" value="@Model.IdAvaliacao" />
            <input type="hidden" name="IdQuestao" value="@Model.Id" />
            <input type="hidden" name="step" value="@(((int)ViewData["StepNext"]))" />
            <input type="hidden" name="numeroAlternativa" value="0" />
            <input type="hidden" name="concluir" value="@(((bool)ViewData["LastStep"]) ? "1" : "0")" />
            <a href="javascript:responde();" style="text-decoration:none;">
                <input type="button" name="Proximo" onclick="responde();" class="button-@(((bool)ViewData["LastStep"]) ? "concluir" : "proximo")"/>
            </a>
        </form>
        
        <span class="questao-pager">
            @Html.Raw(ViewData["Paginacao"] as string)
        </span>

            <!--
        <a style="text-decoration:none;" href="@(Url.Content("~/" + ViewData["ClienteUrl"].ToString() + "/teste/questao/") + Model.IdAvaliacao.ToString() + "/" + ViewData["StepPrev"].ToString())">
            <input type="button" name="Anterior" class="button-anterior" onclick="go('@(Url.Content("~/" + ViewData["ClienteUrl"].ToString() + "/teste/questao/") + Model.IdAvaliacao.ToString() + "/" + ViewData["StepPrev"].ToString())');"/>
        </a>-->
        <form action="@(Url.Content("~/" + ViewData["ClienteUrl"].ToString() + "/Teste/Resposta"))" id="formPrev" method="post" style="display:inline;">
            <input type="hidden" name="IdAvaliacao" value="@Model.IdAvaliacao" />
            <input type="hidden" name="IdQuestao" value="@Model.Id" />
            <input type="hidden" name="step" value="@(((int)ViewData["StepPrev"]))" />
            <input type="hidden" name="numeroAlternativa" value="0" />
            <input type="hidden" name="concluir" value="0" />
            @if (!(bool)ViewData["FirstStep"] && (!(bool)ViewData["LimiteTempo"]))
            {
            <a href="javascript:respondePrevious();" style="text-decoration:none;">
                <input type="button" name="Anterior" onclick="respondePrevious();" class="button-anterior"/>
            </a>
            }
        </form>
        
        
    </span>
</div>
<div class=clear></div>
<div class="span-22" style="text-align:center;">
    
</div>
<div class=clear></div>